<template>
	<view class="list_circle_demand" v-if="list.length">
		<block v-if="type == 1" v-for="(item, index) in list" :key="index">
			<view  class="circle_demand_item" style="padding-top: 10rpx;">
				<view class="circle_demand_top">
					<!-- <view class="circle_demand_top_time">发布时间：{{item.create_time2}}</view> -->
					<view class="circle_demand_top_btn" v-if="isDemandPush">
						<view class="circle_demand_top_btn_top" @click="demandPushTop(item.community_id, index)">{{item.is_demand_push_top == 1 ? '取消置顶' : '置顶'}}</view>
						<view class="circle_demand_top_btn_close" @click="demandPushClose(item.community_id, index)">×</view>
					</view>
				</view>
				<view class="circle_demand_data">
					<!-- <view class="circle_demand_author" @click="goUrl('/pages/plantGrass/demand_detail/index?id='+item.community_id)">
						<view class="circle_demand_avatar"><img :src="item.author.avatar ? item.author.avatar : '/static/images/f.png'" /></view>
						<view class="circle_demand_nickname">{{item.author.nickname}}</view>
					</view> -->
					<view  class="circle_demand_con">
						<view class="circle_demand_title line2" @click="goUrl('/pages/plantGrass/demand_detail/index?id='+item.community_id)"><text class="demand_label">{{item.type_name}}</text>{{item.content}}</view>
            <view class="circle_demand_title_time ">{{item.create_time2}}</view>

						<!-- <view class="circle_demand_info">
							<view  class="circle_demand_price">预算:{{item.price}}<text>元</text>
							<template v-if="item.max_price && parseFloat(item.max_price) > 0">
								-{{item.max_price}}
							</template>
							元
							</view>
							<view  class="circle_demand_button" @click="couponTap2(item)">接单</view>
						</view> -->
					</view>
				</view>
				<view class="community_type1_tel">
          <view class="community_type1_t frist" @click="goUrl('/pages/plantGrass/demand_detail/index?id='+item.community_id)">
            <image  :src="item.author.avatar ? item.author.avatar : '/static/images/f.png'" mode="widthFix"/>
          </view>
          <button class="community_type1_t eyes" open-type="share">
						<image src="https://img.jukee.net/def/d77d9202310141112474983.png" mode="widthFix"/>{{item.hits}}
					</button>
					<view class="community_type1_t" @click="getUserContactInformations(item, 'phone')">
            <image :src="domain + '/uploads/def/20230703/54b09da7a3583769bae9b03a9d626fa7.png'" mode="widthFix"/>
					</view>
          <view class="community_type1_t wx" @click="getUserContactInformations(item, 'we_chat_account')">
            <image :src="domain + '/uploads/def/20230703/8a86ee47e8ca30aa63ce6ad95c1bc151.png'" mode="widthFix"/>
          </view>
					<!-- <button class="community_type1_t" open-type="share" @click="getUserContactInformations(item, 'share')">
						<image :src="domain + '/uploads/def/20230703/d11798e69e13cd3ec85f019c4df2ea53.png'" mode="widthFix"/>
					</button> -->
	
					<view class="community_type1_t" @click="getUserContactInformations(item, 'report')" v-if="is_report">
						<image :src="domain + '/uploads/def/20230703/18f09a404605c6a1b7b4704d9d4e43b4.png'" mode="widthFix"/>
					</view>
				</view>
			</view>
		</block>
		<view v-if="type == 2" class="circle_demand_item" v-for="(item, index) in list" :key="index">
			<view class="circle_demand_data">
				<view  class="circle_demand_con" style="margin-left: 0;">
					<view class="circle_demand_title line2" @click="goUrl(isMy ? '' : '/pages/plantGrass/demand_detail/index?id='+item.community_id)"><text class="demand_label">{{item.type_name}}</text>{{item.content}}</view>
					<view class="circle_demand_info">
						<view  class="circle_demand_price">预算:{{item.price}}<text>元</text>
						<!-- <template v-if="item.max_price && parseFloat(item.max_price) > 0">
							-{{item.max_price}}
						</template>
						元 -->
						</view>
						<view  class="circle_demand_hist"><image :src="domain + '/uploads/def/20230716/4f93935afc8d5e867ebff76b56dfab3c.png'" mode="widthFix"/>{{item.count_start}}</view>
						<view v-if="!isMy"  class="circle_demand_button" @click="couponTap2(item)">接单</view>
						<view v-if="isMy && item.status >= 0"  class="circle_demand_button circle_demand_edit" @click="goUrl('/pages/plantGrass/plant_release/index?type=3&id='+item.community_id)">修改</view>
						<template v-if="isMy">
							<template v-if="item.status == 1">
								<button v-if="isMy" open-type="share" class="circle_demand_button circle_demand_share">分享</button>
							</template>
							<template v-if="item.status == 0">
								<view v-if="isMy" class="circle_demand_button circle_demand_share" style="background-color: #FD0616; color: #fff;">审核中</view>
							</template>
							<template v-if="item.status == -1">
								<view v-if="isMy" class="circle_demand_button circle_demand_share" style="background-color: #FD0616; color: #fff;" @click="delCommunity(item.community_id, index)">删除</view>
							</template>
						</template>
					</view>
					<view v-if="item.status == -1 && isMy" style="color: #FD0616;font-size: 26rpx;font-weight: bold;">失败原因:{{item.refusal}}</view>
				</view>
			</view>
		</view>
		<swiper class="swiper_list_user" indicator-active-color="#494949" interval="5000" circular v-if="type == 3 && list.length" style="height: 1125rpx;" >
			<swiper-item class="list_user" v-for="(list_data, index_data) in list" :key="index_data" v-if="list_data.length >= 2">
				<view class="circle_demand_item" v-for="(item, index) in list_data" :key="index">
					<view class="circle_demand_data">
						<!-- <view class="circle_demand_author" @click="goUrl('/pages/plantGrass/demand_detail/index?id='+item.community_id)">
							<view class="circle_demand_avatar"><img :src="item.author.avatar ? item.author.avatar : '/static/images/f.png'" /></view>
							<view class="circle_demand_nickname">{{item.author.nickname}}</view>
						</view> -->
						<view  class="circle_demand_con">
							<view class="circle_demand_title" @click="goUrl('/pages/plantGrass/demand_detail/index?id='+item.community_id)"><text class="demand_label">{{item.type_name}}</text>{{item.content}}</view>
              <view class="circle_demand_title_time ">{{item.create_time2}}</view>
							<!-- <view class="circle_demand_info">
								<view  class="circle_demand_price" @click="goUrl('/pages/plantGrass/demand_detail/index?id='+item.community_id)">预算:{{item.price}}<text>元</text>
		
								</view>
								<view  class="circle_demand_button" @click="couponTap2(item)">接单</view>
							</view> -->
						</view>
					</view>
					<view class="community_type1_tel">
            <view class="community_type1_t frist" @click="goUrl('/pages/plantGrass/demand_detail/index?id='+item.community_id)">
							<image  :src="item.author.avatar ? item.author.avatar : '/static/images/f.png'" mode="widthFix"/>
						</view>
						<view class="community_type1_t " @click="getUserContactInformations(item, 'report')" v-if="is_report">
							<image :src="domain + '/uploads/def/20230703/18f09a404605c6a1b7b4704d9d4e43b4.png'" mode="widthFix"/>
						</view>
            <button class="community_type1_t eyes" open-type="share">
							<image src="https://img.jukee.net/def/d77d9202310141112474983.png" mode="widthFix"/>{{item.hits}}
						</button>
						<view class="community_type1_t" @click="getUserContactInformations(item, 'phone')">
							<image :src="domain + '/uploads/def/20230703/54b09da7a3583769bae9b03a9d626fa7.png'" mode="widthFix"/>
						</view>
						<!-- <button class="community_type1_t" open-type="share" @click="getUserContactInformations(item, 'share')">
							<image :src="domain + '/uploads/def/20230703/d11798e69e13cd3ec85f019c4df2ea53.png'" mode="widthFix"/>
						</button> -->
			
				
            <view class="community_type1_t wx" @click="getUserContactInformations(item, 'we_chat_account')">
							<image :src="domain + '/uploads/def/20230703/8a86ee47e8ca30aa63ce6ad95c1bc151.png'" mode="widthFix"/>
						</view>
					</view>
				</view>
			</swiper-item>
		</swiper>
		<!-- 手机号微信查看弹窗 -->
		<view class="popup_user_contact" v-show="is_popup_user_contact" @click="is_popup_user_contact=false">
			<view class="popup_user_contact_c">
				<view class="popup_user_contact_h">
					<view class="popup_user_contact_t">提示</view>
					<view class="popup_user_contact_u">{{popup_user_contact_type == 'phone' ? '电话：' : '微信号：'}}<text>{{popup_user_contact}}</text></view>
				</view>
				<view class="popup_user_contact_b">
					<view class="popup_user_contact_close" @click="is_popup_user_contact=false">取消</view>
					<view class="popup_user_contact_copy" @click="copyUserContact">复制</view>
				</view>
			</view>
		</view>
		<!-- 二维码弹窗end -->
		<!-- 购买查看会员次数弹窗 -->
		<paymentData :payMode="payMode" :pay_close="pay_close" :is-call="true" @onChangeFun="onChangeFun" :payTitle="'查看会员联系方式次数'" :payGroupName="'user_contact_information'" :userCount="0" :unit="'个'" :rechargeType="1"></paymentData>
		<!-- 升级VIP弹窗 -->
		<view class="user_vip_tips" v-if="user_vip_tips">
			<view class="user_vip_back"></view>
			<view class="user_vip_content">
				<view class="user_vip_close" @click="user_vip_tips = false">
					<image src="https://ly.jukee.net/uploads/default/20230803/8d5635ef7c1504bfadbd85f0a04270cc.png" />
				</view>
				<view class="user_vip_icon">
					<image src="https://img.jukee.net/def/3902e202311271626269626.png" />
				</view>
				<view class="user_vip_title font-size32-bold">成为VIP会员</view>
				<view class="user_vip_tit font-size36-bold" style="font-size: 46rpx;">无限添加客户微信<br/>查看所有客户联系方式</view>
				<view class="user_vip_messag">更多权益请在 “我的” 会员中心查看</view>
				<view class="user_vip_btn" @click="goUrl('/pages/annex/vip_paid/index')">确定</view>
			</view>
		</view>
		<view class="back_popup flex-aj-center" @click="wechat_qrcode_img = ''" v-if="wechat_qrcode_img">
			<image :src="wechat_qrcode_img" style="width: 500rpx;border-radius: 20rpx;" mode="widthFix" @click="previewImage(wechat_qrcode_img)">
		</view>
	</view>
</template>

<script>
import paymentData from '@/components/payDataList';
import { getUserInfo, getUserContactInformation } from '@/api/user.js';
import { hasCommunityCircle } from '@/api/circle.js';
import { deletePlantApi, demandPushTop, demandPushClose } from '@/api/community.js';
import { mapGetters } from "vuex";
import { configMap } from '@/utils';
import { checkPhone } from '@/utils/validate.js';
import { HTTP_REQUEST_URL } from '@/config/app';
export default {
	components: {
		paymentData
	},
	data() {
		return {
			domain: HTTP_REQUEST_URL,
			userInfo: {},
			is_popup_user_contact: false,
			popup_user_contact: '',
			popup_user_contact_type: '',
			pay_close: false,
			payMode: [{
				name: '微信支付',
				icon: 'icon-weixinzhifu',
				value: 'wechat',
				title: '微信快捷支付',
				payStatus: true
				}
				// #ifdef H5 ||APP-PLUS
				,
				{
				name: '支付宝支付',
				icon: 'icon-zhifubao',
				value: 'alipay',
				title: '支付宝支付',
				payStatus: true
				}
				// #endif
				,
				{
					name: "余额支付",
					icon: "icon-yuezhifu",
					value: 'balance',
					title: '可用余额:',
					number: 0,
					payStatus: this.$store.getters.globalData.yue_pay_status
				}
			],
			user_vip_tips: false,
			wechat_qrcode_img: '', // 微信二维码
		}
	},
	props: {
		list: {
			type: Array|Object,
			default: () => []
		},
		type: {
			type: Number,
			default: 1,
			value: 1,
		},
		is_circle: { // 验证是否进入人脉圈
			type: Number,
			value: 0,
		},
		is_report: {
			type: Boolean,
			value: false,
		},
		isCirle: {
			type: Boolean,
			value: false,
		},
		isMy: {
			type: Boolean,
			default: false,
		},
		isCreateTime: {
			type: Boolean,
			default: false,
		},
		isDemandPush: { // 订单推送 置顶/关闭 按钮
			type: Boolean,
			default: false,
		}
	},
	computed: configMap(['hide_mer_status'], mapGetters(['isLogin','viewColor','keyColor'])),
	created() {
		let that = this;
		if(this.isLogin){
			that.getUserInfo();
		}
	},
	methods: {
		previewImage(url) {
			uni.previewImage({
				urls: [url],
				longPressActions :{
					itemList:['保存图片']
				},
			})
		},
		goUrl(url){
			uni.navigateTo({
				url:url
			})
		},
		/**
		 * 查看会员联系方式
		 * @param {Object} uid
		 * @param {Object} contact_information
		 */
		getUserContactInformations(data, contact_information) {
			if(!this.isLogin) return this.$util.Tips({title:'请先登录'}, {tab: 1, url: '/pages/user/index'})
			let that = this;
			let uid = data.author.uid;
			if(contact_information == 'phone' || contact_information == 'we_chat_account'){
				/* if (that.isCirle) return that.$util.Tips({
					title: '付费进圈可查看会员联系方式'
				}) */
				if (that.isCirle) {
					this.$emit('eventFunction');
					return false;
				}
				getUserContactInformation({uid, contact_information}).then(res=>{
					if(contact_information == 'phone' && checkPhone(res.message)) {
						return uni.makePhoneCall({
							phoneNumber: res.message // 替换为你想拨打的电话号码
						  }).then(() => {
							console.log('拨打电话成功')
						  }).catch((error) => {
							console.log('拨打电话失败', error)
						  })
					} else {
						if (res.data && res.data.is_img == 1) {
							that.wechat_qrcode_img = res.data.data;
						} else {
							if (res.message) {
								that.popup_user_contact = res.message || '暂未设置该联系方式'
								that.popup_user_contact_type = contact_information;
								that.is_popup_user_contact = true;
							} else {
								uni.showModal({
									title: '温馨提示',
									content: '等待对方验证',
									showCancel: false,
								})
							}
						}
					}
				}).catch(err=>{
					if(err == '次数不足') {
						// that.pay_close = true;
						that.user_vip_tips = true;
					}
				})
			}else if(contact_information == 'share') {
				uni.share({
					type: 0,
					scene: 'WXSceneSession',
					title: data.title,
					imageUrl: data.image[0],
					href: '/pages/index/index?spid='+that.userInfo.uid,
					success(res) {
					  // 分享成功
					  console.log('分享成功', res);
					},
					fail(err) {
					  // 分享失败
					  console.log('分享失败', err);
					}
				  });
			}else if(contact_information == 'report') {
				that.$util.Tips('/pages/extends/user_report/index?type=1&link_id='+data.community_id)
			}
		},
		copyUserContact() {
			let that = this;
			that.is_popup_user_contact = false;
			if(this.popup_user_contact && this.popup_user_contact!='暂未设置该联系方式') {
				uni.setClipboardData({
				  data: that.popup_user_contact,
				  success: function () {
					return that.$util.Tips({title:'复制成功'});
				  }
				})
			}else{
				return this.$util.Tips({title:'复制失败'});
			}
		},
		/**
		 * 获取个人用户信息
		 */
		getUserInfo: function() {
			let that = this;
			getUserInfo().then(res => {
				that.userInfo = res.data;
				// #ifdef H5 ||APP-PLUS
				that.payMode[2].number = res.data.now_money;
				// #endif
				// #ifndef H5 ||APP-PLUS
				that.payMode[1].number = res.data.now_money;
				// #endif
			});
		},
		onChangeFun: function(e) {
			let opt = e;
			let action = opt.action || null;
			let value = opt.value != undefined ? opt.value : null;
			action && this[action] && this[action](value);
		},
		payClose: function() {
			this.pay_close = false;
		},
		couponTap2(data) {
			let that = this;
			if (this.isLogin === false) {
				return this.$util.Tips({title: '请先登录'}, {
					tab: 1,
					url: '/pages/user/index'
				})
			} else {
				// uni.navigateTo({
				// 	url: `/pages/chat/customer_list/chat?mer_id=${that.storeInfo.mer_id}&uid=${that.uid}&productId=${that.id}`
				// });
				if(that.is_circle && that.is_circle == 1) {
					hasCommunityCircle({community_id: data.community_id}).then(res=>{
						if(res.data.status == 200) {
							uni.navigateTo({
								url: `/pages/chat/customer_list/chat?userId=${data.uid}&communityId=${data.community_id}`
							});
						}else{
							that.$util.Tips('/pages/extends/circle_create/circle_pay?id='+res.data.circle_id);
						}
					})
				}else{
					if(that.userInfo.is_svip > 0) {
						uni.navigateTo({
							url: `/pages/chat/customer_list/chat?userId=${data.uid}&communityId=${data.community_id}`
						});
					} else {
						that.user_vip_tips = true;
					}
				}
			}
		},
		delCommunity(community_id, index) {
			let that = this;
			deletePlantApi(community_id).then(res=>{
				that.$emit('delCommunity', index)
			})
		},
		// 需求订单推送 置顶喜欢需求
		demandPushTop(community_id, index) {
			let that = this;
			demandPushTop(community_id).then(res=> {
				that.$emit('demandPushTop', {index, is_demand_push_top: that.list[index].is_demand_push_top == 1 ? 0 : 1})
				that.$util.Tips({title: res.message})
			}).catch(err=>{
				that.$util.Tips({title: '置顶失败'})
			})
		},
		// 需求订单推送 关闭不需求
		demandPushClose(community_id, index) {
			let that = this;
			demandPushClose(community_id).then(res=> {
				that.$emit('delCommunity', index)
				that.$util.Tips({title: '删除推荐成功'})
			}).catch(err=>{
				that.$util.Tips({title: '删除推荐失败'})
			})
		}
	}
}
</script>
<style scoped lang="scss">
.list_circle_demand {
	// padding: 0 30rpx;
	.circle_demand_item {
		padding: 30rpx 30rpx 0rpx;
		background-color: #fff;
		box-shadow: 4rpx 4rpx 16rpx 0rpx rgba(125,124,116,0.5);
		border-radius: 12rpx;
		margin-top: 30rpx;
		position: relative;
		.circle_demand_top {
			color: #555555;
			font-size: 22rpx;
			margin-bottom: 20rpx;
			display: flex;
			align-items: center;
			justify-content: space-between;
			.circle_demand_top_btn {
				display: flex;
				align-items: center;
				justify-content: space-between;
				.circle_demand_top_btn_top {
					padding: 5rpx 10rpx;
					border: 1rpx solid #555;
					border-radius: 10rpx;
				}
				.circle_demand_top_btn_close {
					width: 34rpx;
					height: 34rpx;
					display: flex;
					align-items: center;
					justify-content: center;
					border-radius: 50%;
					border: 1rpx solid #555;
					margin-left: 20rpx;
				}
			}
		}
		.circle_demand_data {
			display: flex;
			flex-wrap: nowrap;
			// padding-bottom: 10rpx;
			// border-bottom: 1rpx solid #EFEFEF;
		}
		.circle_demand_author {
			width: 122rpx;
			overflow: hidden;
			text-align: center;
			padding-top: 30rpx;
			.circle_demand_avatar {
				width: 78rpx;
				height: 78rpx;
				border-radius: 50%;
				display: inline-block;
				image {
					width: 78rpx;
					height: 78rpx;
					border-radius: 50%;
				}
			}
			.circle_demand_nickname {
				font-size: 28rpx;
				font-weight: 500;
				color: #292E30;
				line-height: 42rpx;
				margin-top: 15rpx;
				overflow: hidden;
				white-space: nowrap;
			}
		}
		.circle_demand_con {
			// margin-left: 60rpx;
			flex: 1;
			.circle_demand_title {
				font-size: 32rpx;
				font-weight: 550;
				color: #2C2C2C;
				line-height: 48rpx;
				// overflow-y: hidden;
				// height: 100rpx;
        height: 150rpx;
        // 最多显示3行
        display: -webkit-box;
        -webkit-line-clamp: 3;
        -webkit-box-orient: vertical;
        overflow: hidden;
        padding-left: 16rpx;
        padding-top: 16rpx;
				.demand_label {
					background-color: #FFC200;
					color: #fff;
					padding: 8rpx 10rpx;
					font-size: 26rpx;
					border-radius: 10rpx;
					margin-right: 10rpx;
          position: relative;
          &::after{
            content: '';
            position: absolute;
            left: -16rpx;
            top: -16rpx;
            width: 16px;
            height: 16px;
            background-image: url('https://ly.jukee.net/static/homeimg_zheng.png');
            background-size:cover;
            background-repeat: no-repeat;
            background-position: center;
          }
				}
			}
      .circle_demand_title_time{
        text-align: right;
        font-size: 18rpx;
        display: block;
        margin-left: auto;
        top: 12rpx;
        position: relative;
        background: #fff;
        padding: 20rpx;
        &::after{
          width:65%;
          height: 2rpx;
          background: #E5E5E5;
          position: absolute;
          top: 50%;
          left: 0;
          content: '';
          transform: translateY(-50%);
          
        }
      }
			.circle_demand_info {
				margin-top: 20rpx;
				display: flex;
				flex-wrap: nowrap;
				align-items: center;
				// justify-content: space-between;
				.circle_demand_price {
					font-size: 32rpx;
					font-weight: normal;
					color: #FE4504;
					line-height: 34rpx;
					text {
						font-size: 20rpx;
						margin-left: 12rpx;
					}
				}
				.circle_demand_hist {
					display: flex;
					align-items: center;
					font-size: 26rpx;
					font-weight: 400;
					color: #2F2F2F;
					image {
						width: 32rpx;
						height: 22rpx;
						margin-left: 32rpx;
						margin-right: 12rpx;
					}
				}
				.circle_demand_button {
					margin-left: auto;
					width: 164rpx;
					height: 64rpx;
					background: #FFE103;
					border-radius: 32rpx;
					font-size: 34rpx;
					font-weight: 600;
					color: #1C211D;
					line-height: 64rpx;
					text-align: center;
				}
				.circle_demand_edit {
					width: 130rpx;
					height: 66rpx;
					font-size: 30rpx;
					font-weight: unset;
					background-color: #fff;
					border: 1rpx solid #000
				}
				.circle_demand_share {
					width: 130rpx;
					font-size: 30rpx;
					font-weight: unset;
				}
			}
		}
		.community_type1_tel {
			display: flex;
			flex-wrap: nowrap;
			align-items: center;
			padding: 20rpx 0;
			.community_type1_t {
        &.frist{
          width: 60rpx;
          height: 60rpx;
          overflow: hidden;
          image{
            width: 60rpx;
            height: 60rpx;
            border-radius: 50%;
            margin-right: auto;
          }
        }
        &.wx{
          image{
            margin-left: auto;
          }
        }
        &.eyes{
         margin-right: 50rpx;
        }
				width: auto;
				height: 50rpx;
				flex: 1;
				text-align: center;
				display: flex;
				align-items: center;
				justify-content: center;
				font-size: 30rpx;
				image {
					width: 50rpx;
					height: 50rpx;
				}
			}
		}
	}
}
.popup_user_contact {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(0,0,0,0.5);
	    z-index: 10;
	.popup_user_contact_c { 
		width: 480rpx;
		margin: 20vh auto;
		background-color: #fff;
		border-radius: 20rpx;
		text-align: center;
		.popup_user_contact_h {
			padding: 30rpx 30rpx 80rpx;
			border-bottom: 1rpx solid #DDDDDD;
			.popup_user_contact_t {
				font-size: 34rpx;
				font-weight: 400;
				color: #2C332D;
				line-height: 48rpx;
			}
			.popup_user_contact_u{
				font-size: 28rpx;
				font-weight: 500;
				color: #323232;
				line-height: 40rpx;
				margin-top: 32rpx;
				text {
					color: #F73D3B;
				}
			}
		}
		.popup_user_contact_b {
			padding: 20rpx 0;
			text-align: center;
			display: flex;
			flex-wrap: nowrap;
			align-items: center;
			.popup_user_contact_close {
				font-size: 28rpx;
				font-weight: 400;
				color: #666764;
				line-height: 40rpx;
				flex: 1;
			}
			.popup_user_contact_copy {
				font-size: 28rpx;
				font-weight: 400;
				color: #323232;
				line-height: 40rpx;
				border-left: 1rpx solid #DDDDDD;
				flex: 1;
			}
		}
	}
}
// 升级VIP弹窗
	.user_vip_back {
		position: fixed;
		left: 0;
		top: 0;
		width: 100%;
		height: 100%;
		background: rgba(0,0,0,0.5);
		z-index: 35;
	}
	.user_vip_content {
		background-color: #fff;
		position: fixed;
		top: 30%;
		left: 50rpx;
		right: 50rpx;
		// margin: 50% 50rpx 0;
		border-radius: 30rpx;
		padding: 30rpx;
		text-align: center;
		z-index: 35;
		.user_vip_close {
			position: absolute;
			right: 30rpx;
			top: 50rpx;
			image {
				width: 50rpx;
				height: 50rpx;
			}
		}
		.user_vip_icon {
			margin: 0 auto;
			image {
				width: 140rpx;
				height: 130rpx;
				margin: 0 auto;
				display: block;
			}
		}
		.user_vip_tit  {
			margin-top: 20rpx;
		}
		.user_vip_messag {
			font-size: 32rpx;
			margin-top: 30rpx;
		}
		.user_vip_btn {
			font-weight: bold;
			background-color: #FDE515;
			display: inline-block;
			padding: 10rpx 50rpx;
			border-radius: 10rpx;
			margin-top: 30rpx;
			font-size: 42rpx;
		}
	}
// VIP弹窗
.user_vip_back {
	position: fixed;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background: rgba(0,0,0,0.5);
	z-index: 35;
}
.user_vip_content {
	background-color: #fff;
	position: fixed;
	top: 30%;
	left: 50rpx;
	right: 50rpx;
	z-index: 35;
	border-radius: 30rpx;
	padding: 30rpx;
	text-align: center;
	.user_vip_close {
		position: absolute;
		right: 10rpx;
		top: 10rpx;
		image {
			width: 70rpx;
			height: 70rpx;
		}
	}
	.user_vip_icon {
		margin: 0 auto;
		image {
			width: 200rpx;
			height: 186rpx;
			margin: 0 auto;
			display: block;
		}
	}
	.user_vip_tit  {
		margin-top: 20rpx;
	}
	.user_vip_messag {
		font-size: 32rpx;
	}
	.user_vip_btn {
		font-weight: bold;
		background-color: #FDE515;
		display: inline-block;
		padding: 10rpx 50rpx;
		border-radius: 10rpx;
		margin-top: 30rpx;
		font-size: 42rpx;
	}
}
// VIP弹窗end
</style>